import { DirectiveBinding } from 'vue'
import { useUserStore } from '@/store'

const hasAnyAuthority = (el: HTMLElement, binding: DirectiveBinding) => {
  const { authorities } = useUserStore()
    if (!binding.value?.filter((authority: string) => authorities?.includes(authority))?.length && el.parentNode) {
      el.parentNode.removeChild(el)
    }
}

export default {
  mounted(el: HTMLElement, binding: DirectiveBinding) {
    hasAnyAuthority(el, binding)
  },
  updated(el: HTMLElement, binding: DirectiveBinding) {
    hasAnyAuthority(el, binding)
  },
}
